<!-- *Author: 黄旗, *Date: 2020-08-04 15:45:59 -->
<template>
    <div>
        <JG-search :searchData="searchData" @on-change-change="askDatas" @on-input-search="askDatasearch"/>
        <JG-table
            :params="params"
            :data="data"
            :columns="columns"
            :loading="loading"
            :total="total"
            :pageOptss="pageOpts"
            @askData="askData"
            ></JG-table>
    </div>

</template>

<script>
    import { siteindexloglist } from '@api/httpsetting'
    export default {
        name: '',
        components: {},

        data () {
            return {
                pageOpts: [10, 20, 50, 100, 300, 500],
                searchData: {
                    left: [
                        { id: 1, key: 'Input', value: '', clearable: true, placeholder: '请输入日志关键字', callback: 'search' },
                        { id: 2, key: 'DatePicker', show: { show: true }, value: [], type: 'daterange', clearable: true, placeholder: '请选择时间', callback: 'change' },
                        { id: 4, key: 'DatePicker', show: { show: false }, value: new Date(), type: 'date', clearable: false, placeholder: '请选择时间', callback: 'change' }
                        // { id: 3, key: 'Select', value: '1', style: { width: '200px' }, clearable: true, placeholder: '请选择日志类型', childList: [{ value: '1', label: '站点更新日志' }, { value: '2', label: '站点访问日志' }], callback: 'change' }
                    ]
                },
                loading: false,
                total: 0,
                params: { site_id: '', keyword: '', start_time: '', end_time: '', date: '', log_type: '', page: 1, pageSize: 100 },
                columns: [],
                columns1: [
                    { title: '操作时间', key: 'created_at_str', width: 170 },
                    { title: '操作人', key: 'operate_name', width: 100 },
                    { title: '详情', key: 'action_content', ellipsis: true, tooltip: true, minWidth: 120 }
                ],
                columns2: [
                    { title: '详情', key: 'action_content', minWidth: 120 }
                ],
                data: []
            };
        },
        mounted () {
        },
        /* 函数方法集合 */
        methods: {
            /* @函数功能: 初始化 */
            initial (row) {
                this.searchData = {
                    left: [
                        { id: 1, key: 'Input', value: '', clearable: true, placeholder: '请输入日志关键字', callback: 'search' },
                        { id: 2, key: 'DatePicker', show: { show: true }, value: [], type: 'daterange', clearable: true, placeholder: '请选择时间', callback: 'change' },
                        { id: 4, key: 'DatePicker', show: { show: false }, value: new Date(), type: 'date', clearable: false, placeholder: '请选择时间', callback: 'change' }
                        // { id: 3, key: 'Select', value: '1', style: { width: '200px' }, clearable: false, placeholder: '请选择日志类型', childList: [{ value: '1', label: '站点更新日志' }, { value: '2', label: '站点访问日志' }], callback: 'change' }
                    ]
                },
                this.columns = this.columns1
                this.params = { site_id: row.id, keyword: '', start_time: '', end_time: '', date: '', page: 1, pageSize: 100 },
                this.askData()
            },
            askData () {
                this.searchData.left.forEach((item) => {
                    if (item.id === 1) {
                        this.params.keyword = item.value
                    } else if (item.id === 2) {
                        this.params.start_time = item.value[0] ? this.$Date(item.value[0]).format('YYYY-MM-DD') : ''
                        this.params.end_time = item.value[1] ? this.$Date(item.value[1]).format('YYYY-MM-DD') : ''
                    } else if (item.id === 4) {
                        this.params.date = item.value ? this.$Date(item.value).format('YYYY-MM-DD') : ''
                    }
                });

                this.columns = this.columns1
                this.searchData.left.forEach((item) => {
                    if (item.id === 4) {
                        item.show.show = false
                    } else if (item.id === 2) {
                        item.show.show = true
                    }
                })

                this.loading = true
                siteindexloglist(this.params).then(res => {
                    this.data = res.list
                    this.total = res.total
                    this.loading = false
                }).catch(() => {
                    this.loading = false;
                });
            },
            askDatas () {
                this.params.page = 1
                this.params.pageSize = 100
                this.askData()
            },
            askDatasearch () {
                // this.searchData.left.forEach((item) => {
                //     if (item.id === 2) {
                //         item.value = []
                //     } else if (item.id === 3) {
                //         item.value = ''
                //     }
                // });
                this.params.page = 1
                this.params.pageSize = 100
                this.askData()
            }
        }
    }
</script>
